<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content=""/>
    <meta name="author" content=""/>
    <title>退房页面</title>

    <!-- Bootstrap core CSS -->
    <link href="../bootstrap-3.3.7-dist/css/bootstrap.css" rel="stylesheet"/>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <!-- Custom styles for this template -->
    <link href="../bootstrap-3.3.7-dist/css/starter-template.css" rel="stylesheet"/>
	<link rel="stylesheet" href="../mycss/main.css"/>

  </head>
  
  
  <body>
 <!--引用页面头部-->
    <div th:include="header :: header" class="navbar-fixed-top"></div>
    <div class="container">
    <div class="row">
      <div class="col-md-12 column">
	      <div class="starter-template">
	        <h1>期待您下次入住</h1>
	        <p class="lead">微小的幸福就在身边.</p>
	      </div>
      </div>
     </div>
    </div><!-- /.container -->
    
    <div class="container">
		   <div class="row">
		      <div class="col-*-*">
		      	<h3>您的退房已逾期，请确认订单信息并支付余额</h3>
		      </div>
		      <div class="col-*-*">
				     <table class="table">
					  <caption>订单详情</caption>
					  <thead>
					    <tr>
					      <th>订单编号</th>
					      <th>订房时间</th>
					      <th>退房时间</th>
					      <th>押金</th>
					    </tr>
					  </thead>
					  <tbody>
					    <tr th:each="order,orderstate:${orders}">
					      <td th:text="${order.orderId}">订单编号</td>
					      <td th:text="${order.createTime}">订房时间</td>
					      <td>2018-04-16 09:22:42</td>
					      <td th:text="${order.deposit}">￥100</td>
					    </tr>
					  </tbody>
					</table> 	
		      </div>      
		   </div>
       <div class="row pull-right">
       		 <button type="button" class="btn btn-info">结算</button>
       </div>
	  </div>
    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="../jquery/jquery-3.3.1.min.js"></script>
    <script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
  </body>
</html>
